/*
 * @FilePath: \flutter_ducafecat_news_getx\lib\common\widgets\components.dart
 * @Date: 2022-07-12 15:33:23
 * @LastEditTime: 2022-07-18 09:22:19
 * @Description: 大粒度的构件
 */
import 'package:flutter/material.dart';
import 'package:flutter_ducafecat_news_getx/common/style/color.dart';
import 'package:flutter_ducafecat_news_getx/common/utils/utils.dart';
import 'package:flutter_ducafecat_news_getx/common/values/values.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

///卡片的一行，图标，文本，描述，园行图标，箭头
Widget lineCardWidget(
    {required Widget icon,
    required String title,
    String? detail,
    Widget? fujia,
    required VoidCallback onTap}) {
  return InkWell(
    child: Container(
      padding: EdgeInsets.fromLTRB(15.w, 6.h, 15.w, 6.h),
      height: 40.h,
      child: Row(
        children: [
          icon,
          SizedBox(
            width: 10.w,
          ),
          SizedBox(
            width: 180.w,
            child: Row(
              children: [
                Text(
                  title,
                  style: TextStyle(
                    // fontWeight: FontWeight.bold,
                    fontSize: 14.sp,
                  ),
                ),
                detail == null ? Text('') : Text(detail),
                fujia == null ? Text('') : fujia
              ],
            ),
          ),
          Icon(
            Icons.arrow_forward_ios_outlined,
            size: 16,
            color: AppColor.secondaryText,
          )
        ],
      ),
    ),
    onTap: onTap,
  );
}

///用到很多的圆角带音乐图标，播放量的图标，以及文本
///背景图标，坐上图标是否显示，右上播放量，右下的两行文本，底部的文本描述
Widget musicCardMy({
  ///背景图片路径，本地
  String? bg,

  ///左上是否显示，默认显示
  required bool lt,

  ///右上默认播放量100万
  String? rt,

  ///左下第一行文字
  String? lbo,

  ///左下第二行文字
  String? lbt,

  ///底部文字叙述
  String? bottom,
}) {
  return Container(
    margin: EdgeInsets.symmetric(horizontal: 5.w),
    height: 140.h,
    width: 100.h,
    child: Column(
      children: [
        //上部卡片
        Container(
          height: 105.h,
          width: 100.h,
          child: Stack(
            alignment: Alignment.topCenter,
            children: [
              Container(
                height: 100.h,
                width: 90.h,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.all(Radius.circular(10.h)),
                  color: Colors.grey[300],
                ),
              ),
              Positioned(
                bottom: 0,
                child: Stack(
                  children: [
                    Container(
                      height: 100.h,
                      width: 100.h,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.all(Radius.circular(10.h)),
                        color: Colors.amber[200],
                        image: DecorationImage(
                          image: AssetImage(
                              bg == null ? 'assets/images/eg_1.jpg' : bg),
                          fit: BoxFit.cover,
                        ),
                      ),
                    ),
                    //左上小图标
                    lt
                        ? Positioned(
                            child: Container(
                              alignment: Alignment.center,
                              height: 14.h,
                              width: 14.h,
                              decoration: BoxDecoration(
                                  borderRadius:
                                      BorderRadius.all(Radius.circular(7.h)),
                                  color: Colors.transparent.withOpacity(0.5)),
                              child: Icon(
                                Iconfont.changpian,
                                color: AppColors.drawer,
                                size: 14.sp,
                              ),
                            ),
                            top: 5.h,
                            left: 5.h,
                          )
                        : Text(''),
                    //右上小图标加文字说明
                    Positioned(
                      child: Container(
                        alignment: Alignment.center,
                        padding: EdgeInsets.symmetric(
                            horizontal: 2.w, vertical: 1.h),
                        height: 14.h,
                        decoration: BoxDecoration(
                            borderRadius:
                                BorderRadius.all(Radius.circular(10.h)),
                            color: Colors.transparent.withOpacity(0.5)),
                        child: Row(
                          crossAxisAlignment: CrossAxisAlignment.center,
                          children: [
                            SizedBox(
                              height: 12.h,
                              width: 8.h,
                              child: Icon(
                                Icons.arrow_right,
                                color: AppColors.drawer,
                                size: 12.sp,
                              ),
                            ),
                            Text(
                              rt ?? '119.7亿',
                              style: TextStyle(
                                  fontSize: 8.sp, color: AppColors.drawer),
                            )
                          ],
                        ),
                      ),
                      top: 5.h,
                      right: 5.h,
                    ),
                    //左下文本
                    Positioned(
                        bottom: 5.h,
                        left: 5.h,
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(
                              lbo == null ? "" : lbo,
                              style: TextStyle(
                                color: AppColors.primaryElementText,
                                fontWeight: FontWeight.bold,
                              ),
                            ),
                            Text(
                              lbt == null ? "" : lbt,
                              style: TextStyle(
                                color: AppColors.primaryElementText,
                                fontWeight: FontWeight.bold,
                              ),
                            ),
                          ],
                        ))
                  ],
                ),
              )
            ],
          ),
        ),
        //下部文字
        Container(
          height: 33.h,
          width: 100.h,
          child: Text(
            bottom ?? "一个让你元气满满每一个的歌单啦啦啦啦飞机凯撒浪费",
            overflow: TextOverflow.ellipsis,
            maxLines: 2,
            style: TextStyle(fontSize: 11.sp),
          ),
        )
      ],
    ),
  );
}

///推荐音乐前自动垂直滚动的圆框，滚动背景图，下方文字描述
Widget swiperCard({
  ///滚动背景图
  required String image,
}) {
  return Container(
    height: 100.h,
    width: 100.h,
    decoration: BoxDecoration(
      borderRadius: BorderRadius.all(Radius.circular(10.h)),
      color: Colors.amber[400],
      image: DecorationImage(
        image: AssetImage(image),
        fit: BoxFit.cover,
      ),
    ),
    child: Container(
      alignment: Alignment.topRight,
      padding: EdgeInsets.only(right: 6.h, top: 6.h),
      height: 14.h,
      width: 30.w,
      decoration: BoxDecoration(
          borderRadius: BorderRadius.all(Radius.circular(10.h)),
          color: Colors.transparent.withOpacity(0.5)),
      child: SizedBox(
        height: 12.h,
        width: 20.h,
        child: Icon(
          Icons.arrow_right,
          color: AppColors.drawer,
          size: 12.sp,
        ),
      ),
    ),
  );
}

///滚动底部文字
Widget swiperText({required String text}) {
  return Container(
    height: 33.h,
    width: 100.h,
    child: Text(
      text,
      overflow: TextOverflow.ellipsis,
      maxLines: 2,
      style: TextStyle(fontSize: 11.sp),
    ),
  );
}
